/*
 * HTML Skeleton
 * Created 2014 Triangle717
 * <http://le717.github.io/>
 *
 * Licensed under The MIT License
 * <http://opensource.org/licenses/MIT/>
 */


/* Toolbar icon */
#html-skeleton-toolbar { background-image: url("../img/toolbar.svg"); }

/* Prevent scrollbars, slightly enlarge dialog */
.modal-body.html-skeleton {
  overflow: hidden;
  max-height: 420px;
}

/* Move the information text up */
.modal-body.html-skeleton .dialog-message { margin-top: -7px; }

/* Position image container */
.html-skeleton-img {
  top: -25px;
  right: -10px;
  float: right;
  left: 5px;
}

/* Decrease the size of the image path */
.html-skeleton-img .img-src,
.html-skeleton-img .img-error-text { font-size: 0.9em; }

/* Hide Bracket's image path and size display */
.html-skeleton-img .image-header,
.html-skeleton-img .image-path { display: none; }

/* Error text */
.html-skeleton-img .img-error-text { color: #f00; }

/* Scale the image */
.html-skeleton-img-container {
  position: relative;
  width: 270px;
  height: 240px;
}

.html-skeleton-img-shadow { box-shadow: 0 0 3px #000; }

/* Shift the dialog content (excluding the image) up */
.html-skeleton-content {
  position: relative;
  bottom: 20px;
}

/* Space the check boxes apart a bit */
.html-skeleton-form > input { margin-bottom: 4px; }

/* Reduce the amount of blank space underneath the number fields */
.html-skeleton-form > input[type="number"] { margin-bottom: 4px; }

/* Align the browse button with the other elements */
.html-skeleton-dialog a[data-button-id="browse"] {
  margin-bottom: 4px;
  margin-left: 10px;
}

/* Do not place input labels on a new line */
.html-skeleton-form > label { display: inline; }

/* Enlarge the "x" between the input fields */
.html-skeleton-form .letter-x {
  font-weight: 900;
  font-size: 17px;
}

/* Accommodate the "Full HTML Skeleton" description */
#full-skeleton-description {
  position: relative;
  bottom: 5px;
  display: inline-block;
  font-size: 12px;
}
